<template>
	<view class="shell">
		<u-navbar title="修改信息" title-color="black" :title-size="35" :title-bold="true" :immersive="true"
			 :border-bottom="false"></u-navbar>
		<view>
			<button class="headbtn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				<image :src="avatar" mode="aspectFill" style="width: 100%; height: 100%;"></image>
			</button>
		</view>
		<input v-model="name" type="nickname" class="weui-input" placeholder="请输入昵称" @blur="onNickname" />
		<button
			style="color: #ffffff; width: 240px;  margin: auto;  margin-top: 20px; border-radius: 26px; background: #2b9939; font-size: 16px;"
			@click="editInfo">
			确认修改
		</button>
		<!-- <view style="width: 700rpx; height: 20px; font-size: 13px; margin: auto; margin-top: 40rpx;">
			· 申请获取以下权限
		</view>
		<view style="width: 700rpx; height: 20px; font-size: 13px; margin: auto; color: #cbcbcb; margin-top: 25rpx;">
			· 获得公开你的信息(昵称、头像、地区等)
		</view>
		<button
			style="color: #ffffff; width: 270px;  margin: auto;  margin-top: 20px; border-radius: 26px; background: #2b9939; font-size: 16px;"
			@click="wxlogin">
			立即登录
		</button>
		<view @click="goback"
			style="width: 100px; height: 80px; margin:auto; display:flex; justify-content:center; align-items: center; font-size: 16px;">
			暂不授权</view> -->
	</view>
</template>

<script>
	import request from '../../api/http.js'
	export default {
		components: {},
		data() {
			return {
				avatar: '',
				uploadurl: request.BASE_URL,
				name: '',
				userInfo: {},

			};
		},
		onLoad() {

		},
		methods: {
			editInfo(){
				this.$Api.editInfo({
					user_id: uni.getStorageSync('userid'),
					avatarUrl:this.avatar,
					nickName: this.name
				}).then(res => {
					if(res.data.code==0){
						uni.showToast({
							icon:'success',
							title:'修改成功'
						})
						setTimeout(()=>{
							uni.switchTab({
								url: '/pages/main/main'
							})
						},1000)
					}
				}, err => {})
			},
			// 昵称上传
			onNickname(e) {
				this.name = e.detail.value
				uni.setStorageSync('name', this.name);
				console.log(e, '昵称上传')
			},
			//头像授权
			onChooseAvatar(e) {
				let _this = this
				_this.avatar = e.detail.avatarUrl
				// 头像上传
				uni.uploadFile({
					url: _this.uploadurl + '/upload',
					filePath: _this.avatar,
					name: 'image',
					header: {
						"Authorization": uni.getStorageSync('token')
					},
					success: (res) => {
						let infoObj = JSON.parse(res.data)
						_this.avatar = infoObj.data
						console.log(_this.avatar, '头像')
						uni.setStorageSync('avatar', this.avatar);
					},
					fail: (err) => {
						console.log(err, '失败')
					}
				})
			},
			//登录接口
			wxlogin() {
				if (this.avatar == '') {
					uni.showToast({
						icon: 'none',
						title: '请上传头像'
					})
					return
				}
				if (this.name == '') {
					uni.showToast({
						icon: 'none',
						title: '请填写昵称'
					})
					return
				}


				// let _this = this
				uni.getUserProfile({
					desc: '用于完善会员资料',
					lang: 'zh_CN',
					success: (res) => {
						this.userInfo = res.userInfo
						this.userInfo.avatarUrl = this.avatar
						this.userInfo.nickName = this.name
						uni.login({
							provider: 'weixin',
							success: async (loginRes) => {
								console.log('获取code和用户信息', loginRes.code, JSON.stringify(this
									.userInfo))
								let user_info = JSON.stringify(this.userInfo)
								let code = loginRes.code
								this.$Api.wxLogin({
									code: code,
									user_info: user_info
								}).then(res => {
									console.log(this.userInfo)
									console.log(res, '这是啥')
									// uni.setStorageSync('header', res.data.data.info.f_headimgurl);
									// uni.setStorageSync('nickname', res.data.data.info.f_nickName);
									uni.setStorageSync('token', res.data.data.opinfo
										.token);
									uni.setStorageSync('userid', res.data.data.opinfo
										.userId);
									uni.navigateBack({
										delta: 1
									})
									// uni.switchTab({
									// 	url: '/pages/index/index'
									// })
								}, err => {
									uni.showModal({
										title: 'none',
										content: `${JSON.stringify(err)} fail`
									})
								})
							},
							fail: function(err) {
								uni.showToast({
									icon: 'none',
									title: 'fail2'
								})
							}
						});
					}
				})
			}

		},
	};
</script>

<style>
	.headbtn {
		width: 88px;
		height: 88px;
		margin: auto;
		border-radius: 50%;
		padding: 0;
		/* background: #eeeeee; */
		background-image: url('https://gongxiangtaiqiu.axa2.com/taiqiu/loginheader.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 20px;
	}

	.shell {
		width: 100%;
		height: 200px;
		margin-top: 160px;
	}

	.weui-input {
		width: 80px;
		height: 20px;
		margin: auto;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 30px;
		text-align: center;
		border-bottom: 1px solid #eeeeee;
	}

	.box-img {
		width: 50px;
		height: 50px;
		border-radius: 50%;
		background-color: aqua;
		margin: auto;
	}
</style>